﻿<DemoContainer>
    <ApexChart TItem="Order"
               Title="Order Net Value"
               Options=options>

        <ApexPointSeries TItem="Order"
                         Items="Orders"
                         Name="Gross Value"
                         SeriesType="SeriesType.Bar"
                         XValue="@(e => e.Country)"
                         YAggregate="@(e => e.Sum(e => e.GrossValue))"
                         OrderByDescending="e=>e.Y"
                         ShowDataLabels />

        <ApexPointSeries TItem="Order"
                         Items="Orders"
                         Name="Net Value"
                         SeriesType="SeriesType.Bar"
                         XValue="@(e => e.Country)"
                         YAggregate="@(e => e.Sum(e => e.NetValue))"
                         OrderByDescending="e=>e.Y"
                         ShowDataLabels />
    </ApexChart>
</DemoContainer>

@code {
    private List<Order> Orders { get; set; } = SampleData.GetOrders();
    private ApexChartOptions<Order> options;

    protected override void OnInitialized()
    {
        options = new ApexChartOptions<Order>
            {
                Chart = new Chart
                {
                    Stacked = true,
                    StackType = StackType.Percent100,
                    Toolbar = new Toolbar
                    {
                        Show = false
                    }
                },
                PlotOptions = new PlotOptions
                {
                    Bar = new PlotOptionsBar
                    {
                        Horizontal = true,
                    }
                },
                Theme = new Theme { Mode = Mode.Light, Palette = PaletteType.Palette8 },

                Xaxis = new XAxis
                {
                    Title = new AxisTitle
                    {
                        Text = "Percentage",
                        Style = new AxisTitleStyle
                        {
                            FontSize = "14px"
                        }
                    },
                    Labels = new XAxisLabels
                    {
                        Style = new AxisLabelStyle
                        {
                            FontSize = "14px"
                        }
                    }
                },
                Yaxis = new List<YAxis> { new YAxis
                {
                     Title = new AxisTitle
                    {
                        Text = "Country",
                        Style = new AxisTitleStyle {
                            FontSize = "14px"
                        }
                    },
                    Labels = new YAxisLabels {
                        Style = new AxisLabelStyle {
                            FontSize = "14px"
                        } }

                }},
                Legend = new Legend
                {
                    Position = LegendPosition.Right
                }
            };
    }
    }
